﻿<!DOCTYPE html>
<html>
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0">
<title>展开显示插件封装</title>

<!--autor: carriehuang | QQ:453555909 | -->
<head>
    <style type="text/css">
        *{
            margin: 0;
            padding: 0;
        }
        
     
        .box{
     		width: 500px;
     		height: 500px;
     		border: 1px solid #ccc;
     	}
 	 	
    </style>
</head>
<body>
	<div class="box" id="j_box"> 
		<input type="text" value="" name="username"  id="j_text"/>
		<input type="button" value="提交" name="submit"  id="j_submit"/>
		<input type="button" value="删除" name="remove"  id="j_remove"/>
	</div>


	<script charset="utf-8" type="text/javascript" src="/res/libs/zepto/1.1.4/zepto.min.js"></script>
	<script>
		$(function(){
			showHide($('.info-more'), $('.cont-hide'));
			function showHide(x,y){
				x.click(function(){
					x.hasClass('arr-down')? x.addClass('arr-up').removeClass('arr-down'):x.addClass('arr-down').removeClass('arr-up');
					y.toggle();
				});
			}
		});

	</script>
</body>

</html>
